react native (一)
开始接触app方面的工作，真心塞~又开始了周而复始的死磕一个问题专坐一整天的节奏，关键是还没有成绩，实在无语。╮(╯▽╰)╭，还是总结一下最近心塞历程吧……react native中文网：http://reactnative.cn/docs/0.48/getting-started.html看看文档就上手吧（默认环境均已配好）：1.新建项目的那些事：将npm包...
2024-01-10
react native 手势响应
参考地址：https://www.jianshu.com/p/935e5c6a5064官方文档地址：https://facebook.github.io/react-native/docs/panresponder.html官方翻译地址：https://reactnative.cn/docs/0.50/panresponder.html首先，通过react native引入PanResponderimport {PanResponder} from 'react-native'; //这里是当移动了超过2...
2024-01-10
react native 生成APK
参考地址：React native Android 命令 打包apk首先：尝试使用模拟器测试 这里是因为需要确认目前在电脑上的模拟器是可以正常运行的，并且，开发React native的应用程序，肯定是需要做一些本地测试的 第一：生成签名密钥这一步的操作主要是生成需要的签名密钥，供android调用，生成的文件待用在项目...
2024-01-10
react native环境配置
参考链接：https://reactnative.cn/docs/next/getting-started.html1，安装node环境，比较简单略2，安装python2：参考文章3，使用npm安装yarn: 但是输入yarn 报错，命令不存在后经查询知，之前的node版本的8.x太低了，所以在node官网下载了最新版10.x再次操作命令行成功，可以正常运行yarn和react-native命令了；4，安装ja...
2024-01-10
react-native 关闭黄屏警告
将代码放在index.js 中 AppRegistry.registerComponent('App', () => App)之前 //关闭其中某些yellow警告console.ignoredYellowBox = ['Warning: BackAndroid is deprecated. Please use BackHandler instead.','source.uri should not be an empty string','Invalid props.style key']; // 关...
2024-01-10
react-native学习中问题汇总
问题描述：creact-react run-android时报错： Could not get unknown property ‘MYAPP_RELEASE_STORE_FILE’ for SigningConfig_Decorated 截图： 参考：传送门持续跟新~~~...
2024-01-10
react native实现隐藏和显示
1.目的：在APP开发中实现隐藏和显示功能。如点击某一列表，显示其列表下的内容2.实现思路：通过对this.state显示初始状态的判断和三目比较来实现影藏和显示3.代码实现大家如果有其他的好方法可以贴出来一起交流学习（RN新手，欢迎大家指正！！！）...
2024-01-10
React Starter Kit 中文文档
最近没事又翻译了个玩意。Github上的一个Star 非常高的 React 样板程序。由Node.js，Express，GraphQL和React构建，可选加入Redux等，并可以包含Webpack，Babel和Browsersync。项目主页：React Starter KitGithub项目地址：https://github.com/kriasoft/react-starter-kit中文文档地址：http://rsk.book.jasperxu.com/中文文档项目地址：https://...
2024-01-10
前端开发-react-native 项目
快速搭建rn项目步骤：1.命令行指令：npm i react-native-cli -g2.react-native init aaa3.Android Studio 导入创建的aaa项目下的Android文件夹，在安卓模拟机里运行（Android Studio 安装参照官网） 步骤详解 1.安装react native cli 2.react-native init aa(项目名) 3.aa项目下的Android文件夹导入Android Studio 4.运行项目 5.创建模拟机...
2024-01-10
再看react native组件生命周期
componentwillreceiveprops可用以下方法替换什么时候在componentwillMount中初始化想要用ref获取到真实的dom节点的时候：应该在willmount方法中进行，在构造方法中是获取不到真实的dom节点的想从远端加载数据，进行请求⚠️注意：在这个方法中调用setState方法将会触发一次渲染，但是它是在浏览器刷新屏...
2024-01-10
mac 本搭建react-native环境
开始做rn（react-native）项目了，无比激动。 首先我们从rn的环境搭建开始。 1.安装必须的软件 包括以下： （1）Node （2）Xcode（最好在苹果的app store上下载并且安装） （3）Android Studio 在安装Android Studio之前需要安装JDK， 具体参照react-native 官网 默认点击OK即可 next 正在安装中。。。 next 这里选择...
2024-01-10
使用react native制作的微博客户端
简要说明: 因为微博授权权限设置,本人的微博开放者账号权限太低,如果出现 'api请求次数受限,请更换. 10023' 弹框 或者 授权界面出错,需要自行更换开放者应用的appkey,授权回调页,App Secret. 修改位置在 App/Home/login.js新浪开放者平台因为项目较为简单,所以不使用redux或者mbox.其实,因为我不太会,这么说吧....
2024-01-10
React native修改state中的数组
今天遇到在react native中修改state中子项为数组的情况，一直赋值不成功，后来查资料发现native中数组是引用，不能直接对引用赋值，查找资料的时候找到了该网页：修改数组项的时候要返回一个新数组，可以用扩展运算符...加上新的项！后来完美解决！感谢网友的强大力量补充：删除state中的数...
2024-01-10
react-native个人挖坑避雷指南
本文为个人react-native学习应用过程中遇到的坑，总结自用，仅供参考。1.替换APP.js会遇到下图问题(暂未解决)错误翻译：无法连接到开发服务器。尝试以下解决问题：确认包服务器运行确认你的设备或者模拟器连接着电脑，且手机启动USB调试模式，在cmd中运行adb devices来查看已经连接好的设备列表...
2024-01-10
vim开发react native 有断点调试插件吗？
vim开发react native 有断点调试插件吗，可以直接在vim打开的文件上打断点，并在vim窗口下方显示输出信息。类似这种：...
2024-01-10
从web移动端布局到react native布局
在web移动端通常会有这样的需求，实现上中下三栏布局（上下导航栏位置固定，中间部分内容超出可滚动），如下图所示：实现方法如下：HTML结构：<div class='container'> <div class='header'></div> <div class='content'></div> <div class='footer'></div></div>首先可以利用fixed或者absolute定位，实现简单。现在介绍...
2024-01-10
react-native使用谷歌浏览器调试
学习交流：https://gitee.com/potato512/Learn_ReactNativereact-native学习交流QQ群：806870562通过 谷歌浏览器Chrome调试React Native程序步骤一：先在模拟器上运行项目步骤二：选中模拟器，同时使用键盘上的组合键"Command + D"打开Developer Menu菜单，并单击选择”Debug JS Remotely"步骤三：在打开的谷歌浏览器里选择开发者...
2024-01-10
react实战 : react 与 svg
有一个需求是这样的。一个组件里若干个区块。区块数量不定。区块里面是一个波浪效果组件，而这个一般用 SVG 做。所以就变成了在 react 中使用 SVG 的问题。首先是波浪效果需要的样式。.p{ font-size: 12px; line-height: 2; text-align: center; margin:0; width: 52px; color: #fff;}.irrigate_svg { height: 52px; widt...
2024-01-10
react native 的底部导航栏以及跳转页面带参数
不知不觉又过去了一周，这周依旧是用RN来开发APP，中间遇到很多坑，不过这段时间还是忙，慢慢总结吧，写出一点是一点。写博客除了分享，在开始写之前也是自己对于这段时间学习的总结，重新看代码，理顺思路，这样才能娓娓道来。算是共同进步吧一、RN的底部导航栏的实现1、开发前说明，博...
2024-01-10
自学React-native （第二天）-- 布局
自学React-native （第二天）-- 布局1.前言：RN中布局使用的是flex(弹性布局方式)。布局的传统解决方案，基于盒状模型，依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。2009年，W3C 提出了一种新的方案----Flex 布局，可以简便、完整、响应式地...
2024-01-10
react-native热更新从零到成功中的各种坑
https://github.com/reactnativecn/react-native-pushy/blob/master/docs/guide.mdAndroid NDK暂时没有安装在你的项目根目录下运行以下命令：1. npm install -g react-native-update-cli rnpm成功截图2. 安装命令示例：（我的0.37）npm install --save react-native-update@4.x把此工程的相关操作关掉，否则好像会报错（npm ERR! e...
2024-01-10
用 `react native` 模仿做的一个美团客户端首页
一开始让我开发ios我是拒绝的，因为看到oc的语法，略感蛋疼，实在是不想套进去，可能苹果也意识到了这个问题，所以推出了swift，我研究了一下，感觉这才像是编程语言，起码人性化多了，但是Xcode代码补全弱爆了，可能是idea用惯了，xcode真心不习惯了，装了插件也感觉好弱，折腾没多久，就搁置了...
2024-01-10
React+antd 实现文本滚动
有一个很长的文本，想要实现上下自动滚动，就是进入页面，不需要任何操作，文本自动从开头滚动回答之前有个 marquee 标签不过废弃了，这个要自己封装吧，可以搜一下别人的实现。基本思路应该就是：利用定时器，固定时间内修改偏移量；长文本可以考虑虚拟滚动，或者裁剪数组。...
2024-01-10
react 中使用 import() 报错
使用npx create-react-app my-app创建的应用，添加了react-router-dom使用import()时，报错，如下，请问是怎么回事??应该怎么配置呢配置项目地址：https://zhonggu.coding.net/public/react-learn/react-learn/git/files回答既然你这个是学习的项目，不妨开源出来，方便大家帮你排查原因。原因找到了，是因为包react-scripts的版本...
2024-01-10
深坑react 引入antd无效问题
//安装babel-plugin-import第一步：npm install babel-plugin-import --save第二步：暴露webpack.config.js运行：npm run eject第三步：在webpack.config.js中的module下的oneOf数组里加入下面代码： {//ES6、JSX处理 test: /(\.jsx|\.js)$/, exclude: /node_modules/, load...
2024-01-10
